import 'package:flutter/material.dart';
import 'package:flutter_base/base/widget/base_list_more_get_builder.dart';
import 'package:flutter_base/config/app_color.dart';
import 'package:flutter_base/config/app_config.dart';
import 'package:flutter_base/generated/assets.dart';
import 'package:flutter_base/pages/mine/test_history/model/model_test_history.dart';

import 'package:flutter_base/widgets/image/auto_image.dart';
import 'package:flutter_base/widgets/image/image_view.dart';
import 'package:get/get.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'test_history_list_logic.dart';

class TestHistoryListPage extends StatelessWidget {
  TestHistoryListPage({super.key, required this.type});

  late final TestHistoryListLogic logic =
      Get.put(TestHistoryListLogic(type: type), tag: type.toString());
  final int type;

  @override
  Widget build(BuildContext context) {
    return BaseListMoreGetBuilder<TestHistoryListLogic>(
      init: logic,
      tag: type.toString(),
      backgroundColor: Colors.transparent,
      builder: (logic) {
        return ListView.builder(
          padding: EdgeInsets.symmetric(horizontal: 16.w),
          itemCount: logic.list.length ?? 0,
          itemBuilder: (context, index) {
            ModelTestHistory test = logic.list[index];
            // return _buildCompletedTestCard(test);
            return type == 1
                ? _buildCompletedTestCard(test)
                : _buildNotCompletedTestCard(test);
          },
        );
      },
    );
  }

  // 构建已完成测试卡片
  Widget _buildCompletedTestCard(ModelTestHistory test) {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 10.w),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20.w),
      ),
      padding: EdgeInsets.all(16.w),
      child: Column(
        children: [
          // 卡片内容
          Row(
            children: [
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    // 测试标题
                    Text(
                      test.testName ?? '',
                      style: TextStyle(
                        fontSize: 14.sp,
                        fontWeight: FontWeight.w600,
                        color: AppColor.color0C0A09,
                      ),
                    ),

                    SizedBox(height: 4.w),

                    // 测试描述
                    Text(
                      test.testDesc ?? '',
                      style: TextStyle(
                        fontSize: 12.sp,
                        fontWeight: FontWeight.w400,
                        color: AppColor.color7F909E,
                      ),
                      maxLines: 2,
                      overflow: TextOverflow.ellipsis,
                    ),

                    SizedBox(height: 12.w),

                    // 时间信息
                    Text(
                      test.startTime ?? "",
                      style: TextStyle(
                        fontSize: 10.sp,
                        fontWeight: FontWeight.w400,
                        color: AppColor.color0C0A09.withOpacity(0.16),
                      ),
                    ),
                  ],
                ),
              ),

              // 详情按钮
              GestureDetector(
                onTap: () {
                  logic.onViewDetails(test);
                },
                behavior: HitTestBehavior.opaque,
                child: Container(
                  height: 32.w,
                  decoration: BoxDecoration(
                    color: const Color(0xFFF5F7FA),
                    borderRadius: BorderRadius.circular(20.w),
                  ),
                  padding: EdgeInsets.only(left: 12.w, right: 6.w),
                  child: Row(
                    children: [
                      Text(
                        'Details',
                        style: TextStyle(
                          fontSize: 12.sp,
                          fontWeight: FontWeight.w700,
                          color: const Color(0xFF19DBF2),
                        ),
                      ),
                      SizedBox(width: 2.w),
                      AutoImage(
                        Assets.detailsArrow,
                        width: 16.w,
                        height: 16.w,
                        color: const Color(0xFF19DBF2),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),

          SizedBox(height: 12.w),

          // 按钮区域
          Row(
            children: [
              // 生成报告按钮
              Expanded(
                child: GestureDetector(
                  onTap: () => logic.onGenerateReport(test),
                  child: Container(
                    height: 40.w,
                    decoration: BoxDecoration(
                      border: Border.all(
                        color: const Color(0xFF19DBF2),
                        width: 1.w,
                      ),
                      borderRadius: BorderRadius.circular(78.w),
                    ),
                    alignment: Alignment.center,
                    child: Text(
                      'Generate Report',
                      style: TextStyle(
                        fontSize: 14.sp,
                        fontWeight: FontWeight.w600,
                        color: const Color(0xFF19DBF2),
                      ),
                    ),
                  ),
                ),
              ),

              SizedBox(width: 8.w),

              // 再次测试按钮
              Expanded(
                child: GestureDetector(
                  onTap: () => logic.onTestAgain(test),
                  child: Container(
                    height: 40.w,
                    decoration: BoxDecoration(
                      color: const Color(0xFF19DBF2),
                      borderRadius: BorderRadius.circular(78.w),
                    ),
                    alignment: Alignment.center,
                    child: Text(
                      'Test Again',
                      style: TextStyle(
                        fontSize: 14.sp,
                        fontWeight: FontWeight.w600,
                        color: Colors.white,
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  // 构建未完成测试卡片
  Widget _buildNotCompletedTestCard(ModelTestHistory test) {
    // 计算进度百分比
    int progress = test.progress ?? 0;
    int questionCount = test.questionCount ?? 100;
    double progressPercent = progress / questionCount;
    int progressPercentInt = (progressPercent * 100).toInt();

    return Container(
      margin: EdgeInsets.symmetric(vertical: 10.w),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20.w),
      ),
      padding: EdgeInsets.all(16.w),
      child: Column(
        children: [
          // 卡片内容
          Row(
            children: [
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    // 测试标题
                    Text(
                      test.testName ?? '',
                      style: TextStyle(
                        fontSize: 14.sp,
                        fontWeight: FontWeight.w700,
                        color: AppColor.color0C0A09,
                      ),
                    ),

                    SizedBox(height: 4.w),

                    // 测试描述
                    Text(
                      test.testDesc ?? '',
                      style: TextStyle(
                        fontSize: 12.sp,
                        fontWeight: FontWeight.w400,
                        color: AppColor.color7F909E,
                      ),
                      maxLines: 2,
                      overflow: TextOverflow.ellipsis,
                    ),

                    SizedBox(height: 12.w),

                    // 时间信息
                    Text(
                      test.startTime ?? "",
                      style: TextStyle(
                        fontSize: 10.sp,
                        fontWeight: FontWeight.w400,
                        color: AppColor.color0C0A09.withOpacity(0.16),
                      ),
                    ),
                  ],
                ),
              ),

              // 继续按钮
              GestureDetector(
                onTap: () {
                  // 继续测试的逻辑
                },
                child: Container(
                  width: 32.w,
                  height: 32.w,
                  decoration: BoxDecoration(
                    color: const Color(0xFFF5F7FA),
                    shape: BoxShape.circle,
                  ),
                  child: Center(
                    child: Icon(
                      Icons.arrow_forward_ios,
                      color: const Color(0xFFEB3B30),
                      size: 16.w,
                    ),
                  ),
                ),
              ),
            ],
          ),

          SizedBox(height: 12.w),

          // 进度信息和进度条
          Container(
            padding: EdgeInsets.symmetric(vertical: 12.w),
            decoration: BoxDecoration(
              color: const Color(0xFFF8FCFF),
              borderRadius: BorderRadius.circular(12.w),
              border: Border.all(
                color: const Color(0xFFF5F7FA),
                width: 1.w,
              ),
            ),
            child: Column(
              children: [
                // 进度信息
                Padding(
                  padding: EdgeInsets.symmetric(horizontal: 12.w),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      // 左侧进度文本
                      Row(
                        children: [
                          Text(
                            'Progress:',
                            style: TextStyle(
                              fontSize: 12.sp,
                              fontWeight: FontWeight.w700,
                              color: AppColor.color0C0A09,
                            ),
                          ),
                          SizedBox(width: 4.w),
                          Text(
                            '$progress',
                            style: TextStyle(
                              fontSize: 12.sp,
                              fontWeight: FontWeight.w600,
                              color: AppColor.color0C0A09,
                            ),
                          ),
                          SizedBox(width: 2.w),
                          Text(
                            '/',
                            style: TextStyle(
                              fontSize: 12.sp,
                              fontWeight: FontWeight.w500,
                              color: AppColor.color0C0A09.withOpacity(0.16),
                            ),
                          ),
                          SizedBox(width: 2.w),
                          Text(
                            '$questionCount',
                            style: TextStyle(
                              fontSize: 12.sp,
                              fontWeight: FontWeight.w400,
                              color: AppColor.color0C0A09.withOpacity(0.16),
                            ),
                          ),
                        ],
                      ),

                      // 右侧百分比
                      Text(
                        '$progressPercentInt%',
                        style: TextStyle(
                          fontSize: 12.sp,
                          fontWeight: FontWeight.w400,
                          color: const Color(0xFF19DBF2),
                        ),
                      ),
                    ],
                  ),
                ),

                SizedBox(height: 4.w),

                // 进度条
                Padding(
                  padding: EdgeInsets.symmetric(horizontal: 12.w),
                  child: Stack(
                    children: [
                      // 背景
                      Container(
                        height: 6.w,
                        width: double.infinity,
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(8.w),
                        ),
                      ),
                      // 进度
                      Container(
                        height: 6.w,
                        width: (MediaQuery.of(Get.context!).size.width - 80.w) *
                            progressPercent,
                        decoration: BoxDecoration(
                          color: const Color(0xFF19DBF2),
                          borderRadius: BorderRadius.circular(8.w),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),

          SizedBox(height: 12.w),

          // 继续按钮
          GestureDetector(
            onTap: () {
              // 继续测试的逻辑
            },
            child: Container(
              height: 40.w,
              width: double.infinity,
              decoration: BoxDecoration(
                color: const Color(0xFF19DBF2),
                borderRadius: BorderRadius.circular(78.w),
              ),
              alignment: Alignment.center,
              child: Text(
                'Continue',
                style: TextStyle(
                  fontSize: 14.sp,
                  fontWeight: FontWeight.w700,
                  color: Colors.white,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
